<meta charset="UTF-8">

<form id="myForm" action="" class="form-horizontal" role="form" >
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
	           	<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
	           	<h4 class="modal-title">图书</h4>
	       	</div>
	       	<div class="modal-body">
	       		<input type="hidden" name="id" data-th-value="${model.id}">
	       		<input type="hidden" name="uuid" data-th-value="${model.uuid}" id="fileuuid">
	       		
		     	<div class="form-group">
		           	<label for="txt_dept" class="col-sm-2 control-label">图书名称</label>
		           	<div class="col-sm-9">
		                <input type="text" name="bookName" data-th-value="${model.bookName}" class="form-control" placeholder="图书名称">
		           	</div>
		     	</div>
		     	<div class="form-group">
		           	<label for="txt_dept" class="col-sm-2 control-label">图书编码</label>
		           	<div class="col-sm-9">
		                <input type="text" name="bookCode" data-th-value="${model.bookCode}" class="form-control" placeholder="图书编码">
		           	</div>
		     	</div>
		     	<div class="form-group">
		           	<label for="txt_dept" class="col-sm-2 control-label">图书数量</label>
		           	<div class="col-sm-9">
		                <input type="text" name="quantity" data-th-value="${model.quantity}" class="form-control" placeholder="图书数量">
		           	</div>
		     	</div>
		     	<div class="form-group">
		           	<label for="txt_dept" class="col-sm-2 control-label">出版社</label>
		           	<div class="col-sm-9">
		                <input type="text" name="press" data-th-value="${model.press}" class="form-control" placeholder="出版社">
		           	</div>
		     	</div>
		     	<div class="form-group">
		           	<label for="txt_dept" class="col-sm-2 control-label">作者</label>
		           	<div class="col-sm-9">
		                <input type="text" name="author" data-th-value="${model.author}" class="form-control" placeholder="作者">
		           	</div>
		     	</div>
		     	<div class="form-group">
		           	<label for="txt_dept" class="col-sm-2 control-label">图书类型</label>
		           	<div class="col-sm-9">
		                <select class="form-control" id="blog_classify" name = "booktypeId.id">
						<option>-请选择-</option>
						<option th:each="c:${list}" th:value="${c.id}" th:text="${c.type}" th:selected="${model.booktype==null?null:model.booktype.type ==c.type}"></option>
					</select>
		           	</div>
		     	</div>
		     	<div class="form-group">
		           	<label for="txt_dept" class="col-sm-2 control-label">简介</label>
		           	<div class="col-sm-9">
		                <textarea type="text" name="intro" data-th-value="${model.intro}" class="form-control" placeholder="简介"></textarea>
		           	</div>
		     	</div>
		     	<div class="form-group">
  					<label for="txt_dept" class="col-sm-2 control-label">文件上传</label>
					<div class="layui-upload-drag col-sm-9" id="uploading">
					<div th:if="${model.uuid==null}">
						  <i class="layui-icon"></i>
						  <p>点击上传，或将文件拖拽到此处</p>
					</div>
					<div data-th-if="${model.uuid!=null}">
						  <img alt="" data-th-src="'book/download?uuid='+${model.uuid}" width="100px" height="100px" title="点击重新选择">
				  </div>
					</div>
		     	</div> 
	       	</div>
	       	
	       	<div class="modal-footer">
				<button type="submit" class="btn btn-success">
					<span class="glyphicon glyphicon-ok"></span> 确定
				</button>
				<button type="button" class="btn btn-danger" data-dismiss="modal">
					<span class="glyphicon glyphicon-remove"></span> 关闭
				</button>
			</div>
		</div>
	</div>
</form>

<script>
layui.use('upload', function(){
	  upload = layui.upload;
	  
	//拖拽上传
	var uploadInst = upload.render({
	    elem: '#uploading',
	    url: 'book/upload',
	    done: function(res){
            if(res.success){
            	$("#fileuuid").val(res.msg);
            	$("#uploading").html('<img alt="" src="book/download?uuid='+res.msg+'" width="100px" height="100px" title="点击重新选择">' );
            }else{
            	layer.open({
            		title: '上传失败'
            		,content: res.msg
            		,time: 2000
            	});   
            }
        }
	  });
});
var options = {
	message: '验证不通过',
	feedbackIcons: {
		 valid: 'glyphicon glyphicon-ok',
           invalid: 'glyphicon glyphicon-remove',
           validating: 'glyphicon glyphicon-refresh'
	},
	fields: {
		bookName: {
			validators: {
				notEmpty: {
					message: '图书名称不能为空'
				}
			}
		},
		bookCode:{
			validators: {
				notEmpty: {
					message: '图书编码不能为空'
				}
			}
		},
		quantity:{
			validators: {
				notEmpty: {
					message: '图书数量不能为空'
				}
			}
		},
		type:{
			validators: {
				notEmpty: {
					message: '图书类型不能为空'
				}
			}
		},
		intro:{
			validators: {
				notEmpty: {
					message: '简介不能为空'
				}
			}
		},
		press:{
			validators: {
				notEmpty: {
					message: '出版社不能为空'
				}
			}
		},
		author:{
			validators: {
				notEmpty: {
					message: '作者不能为空'
				}
			}
		}
	}
};

$("#myForm").bootstrapValidator(options).on("success.form.bv", function(e){
	e.preventDefault();
	var form= new FormData($("#myForm")[0]);
	$.ajax({
		url: 'book/save',
		type: 'post',
		data: form,
		processData: false,  //不处理数据
		contentType: false,		//不设置内容类型
		success: function(result){
			if(result.success){
				$("#myModal").modal("hide");
				bootbox.alert("数据保存成功");
				$("#book").bootstrapTable("refresh");
			}else{
				bootbox.alert("数据保存失败");
			}
		},
		error: function(result){
			bootbox.alert("数据保存失败！");
		}
	})
})
</script>
